<template>
  <div>
    <Tips v-show="!isEdit" />
    <CollapseItem :items="ceilingStyles" @edit="toEdit" v-show="!isEdit" />
    <router-view></router-view>
  </div>
</template>

<script setup lang="ts">
import { useData } from "@/hooks/useData";
import { topDesignData } from "@/types/tempData";
import CollapseItem from "./components/CollapseItem.vue"
import { ref, shallowRef } from "vue";
import { useRouter, onBeforeRouteUpdate } from "vue-router";
const { getDefaultData } = useData("Ceiling.CeilingStyleFinish")
// 去编辑
const isEdit = ref(false)
const router = useRouter()
const ceilingStyles = ref<ICeilingStyle[]>([])

getDefaultData<{ ceilingStyles: ICeilingStyle[] }>().then(res => {
  console.log('获取到的值是：', res)
  ceilingStyles.value = res.ceilingStyles
})
const toEdit = (id: string) => {
  console.log("编辑的id:", id)
  isEdit.value = true
  router.push(`/CeilingStyle/edit/${id}`)
}
console.log(topDesignData)

onBeforeRouteUpdate((to, from, next) => {
  if (to.fullPath == "/CeilingStyle") {
    isEdit.value = false
  }
  next()

})

const stepList = [
  {
    name: '分区生成1',
    id: 1
  },
  {
    name: '吊顶设计2',
    id: 2
  },
  {
    name: '设计完成3',
    id: 3
  }
]
</script>
<style lang="scss" scoped></style>